<!DOCTYPE html>
<html lang="en">
<head>
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
  <meta content="no-cache" http-equiv="Cache-Control"/>
  <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
  <meta content="yes" name="apple-mobile-web-app-capable"/>
  <meta content="telephone=no" name="format-detection"/>
  <title>聊聊</title>
  <link rel="stylesheet" href="../css/weui.min.css">
  <link rel="stylesheet" href="../css/style.css">
</head>
<body>
<div class="weui-mask loading-bg"></div>
<div class="main" id="app">
  <!--<div class="weui-search-bar" id="searchBar">
    <form class="weui-search-bar__form">
      <div class="weui-search-bar__box">
        <i class="weui-icon-search"></i>
        <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="ID/昵称" v-model="selectValue" @input="getChatList">
        <a href="javascript:" class="weui-icon-clear" id="searchClear" @click="selectValue = '';getChatList()"></a>
      </div>
      &lt;!&ndash;<label class="weui-search-bar__label" id="searchText">
        <i class="weui-icon-search"></i>
        <span>在结果里搜索 ID/昵称/备注</span>
      </label>&ndash;&gt;
    </form>
    <a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
  </div>-->

  <div class="search-bar weui-flex">
    <div class="input-block weui-flex">
      <img src="../img/icon-search.png">
      <input class="weui-flex__item" type="text" placeholder="在结果里搜索ID/昵称" v-model="selectValue" @input="getChatList">
      <img src="../img/icon-remove.png" @click="selectValue = '';getChatList()" v-if="selectValue.length > 0">
    </div>
  </div>

  <div class="marry-title weui-flex hairline-bottom">
    <div class="weui-flex__item"></div>
    <div class="right-title weui-flex">
      <div class="weui-flex__item">诚信分</div>
      <div class="weui-flex__item">ta配我</div>
      <div class="weui-flex__item">我配ta</div>
    </div>
  </div>
  <div class="user-list" @scroll="scrollList">
    <a class="user-item weui-flex hairline-bottom" v-for="item in chatList" @click="createChat(item)">
      <img src="../img/default-header.png" :data-src="item.HeadImgUrl" @click.stop.prevent="jumpToUserDetail(item)">
      <div class="unread-flag" v-if="item.NewMsg == 'T'"></div>
      <div class="right-block weui-flex weui-flex__item">
        <div class="username num_name">{{item.NickName}}</div>
        <div class="right-value weui-flex">
          <div class="weui-flex__item">{{item.Sincerity == 0 ? '' : item.Sincerity + '分'}}</div>
          <div class="weui-flex__item">{{formatNum(item.ToMe * 100)}}%</div>
          <div class="weui-flex__item">{{formatNum(item.ToTa * 100)}}%</div>
        </div>
        <div class="user-attr weui-flex">
          <div class="item" v-if="item.age">{{item.age}}岁</div>
          <div class="item" v-if="item.constellation">{{item.constellation}}座</div>
          <div class="item" v-if="item.cityAttr">{{item.cityAttr}}</div>
        </div>
        <div class="info-num">{{item.LastMsg[0] ? item.LastMsg[0].ChatContent : ''}}</div>
        <div class="info-time">{{item.LastMsg[0] ? formatDate(item.LastMsg[0].CreatedAt) : ''}}</div>
      </div>
    </a>
  </div>
</div>
<script type="text/javascript" src="../js/tools/weui.js"></script>
<script type="text/javascript" src="../js/tools/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="../js/tools/vue.js"></script>
<script type="text/javascript" src="../js/common/common.js"></script>
<script type="text/javascript" src="../js/serviceInterface/serviceInterface.js"></script>
<script type="text/javascript" src="../js/tools/search.js"></script>
<script type="text/javascript" src="../js/pages/message_friends.js"></script>
</body>
</html>